<template>
	<view>
		<!-- <view class="Modal_mask" @click.stop="closes"></view> -->
		<view class="c_modal">
			<view class="c_title">选择收款方式</view>
			<view class="c_list">
				<view class="c_block" @click="$goPage('../c2cCard/c2cCard?type=1')">
					<view class="left">
						<image src="/static/c2c/yhk.png" mode="aspectFit"></image>
						<text>银行卡</text>
					</view>
					<uni-icons type="arrowright" :color="'#8C9FAD'" size="24"></uni-icons>
				</view>
				<view class="c_block" @click="$goPage('../c2cCard/c2cCard?type=2')">
					<view class="left">
						<image src="/static/c2c/zfb.png" mode="aspectFit"></image>
						<text>支付宝</text>
					</view>
					<uni-icons type="arrowright" :color="'#8C9FAD'" size="24"></uni-icons>
				</view>
				<view class="c_block" @click="$goPage('../c2cCard/c2cCard?type=3')">
					<view class="left">
						<image src="/static/c2c/wx.png" mode="aspectFit"></image>
						<text>微信</text>
					</view>
					<uni-icons type="arrowright" :color="'#8C9FAD'" size="24"></uni-icons>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import uniIcons from '@/components/uni-icon/uni-icon.vue';
export default {
	name: 'lkex-modal',
	components: { uniIcons },
	props: {
		
	},
	data() {
		return {};
	},
	methods: {
		hideModal() {
			if (this.isMask) {
				this.$emit('close');
			}
		},
		closes() {
			this.$emit('close');
		}
	}
};
</script>

<style lang="scss">
.Modal_mask {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 999;
}
.c_modal {
	z-index: 9999;
	position: fixed;
	width: 600rpx;
	bottom: 0;
	top: 0;
	right: 0;
	border: 2upx solid #b5b5b5;
	background: #fff;
	overflow-y: scroll;
	.c_title {
		height: 88rpx;
		background: #1D2243;
		font-size: 36rpx;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: bold;
	}
	.c_top {
		display: flex;
		height: 186rpx;
		align-items: center;
		padding-left: 48rpx;
		border-bottom: 2rpx solid #E7EBEE;
		image {
			width: 86upx;
			height: 86upx;
			margin-right: 20rpx;
			border-radius: 50%;
			overflow: hidden;
		}
		view {
			.big {
				font-size: 36rpx;
				display: block;
				margin-bottom: 16rpx;
				font-weight: bold;
			}
			.small {
				color: $gray;
			}
		}
	}
	.c_list {
		.c_block {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 40rpx 0 48rpx;
			border-bottom: 2rpx solid #E7EBEE;
			height: 100rpx;
			.set {
				font-size: 32rpx;
				color: #C5CFD5;
			}
			.f_flex {
				display: flex;
				align-items: center;
			}
			.left {
				display: flex;
				align-items: center;
				image {
					width: 44rpx;
					height: 44rpx;
					margin-right: 18rpx;
				}
				text {
					font-size: 32rpx;
					font-weight: bold;
				}
			}			
		}
	}
	.c_btn {
		width:504rpx;
		height:66rpx;
		background:rgba(24,130,212,1);
		border-radius:6rpx;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 50rpx auto 24rpx;
		font-weight: bold;
	}
}
</style>
